<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<!--标准mui.css-->
		<script type="text/javascript" src="fonts/iconfont.js" ></script>
		<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/mui.css">
		<link rel="stylesheet" type="text/css" href="css/mui.picker.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/ztree/zTreeStyle/zTreeStyle.css"/>
		<style type="text/css">
		    .ul-ohter *{box-sizing: border-box;}
		    span.smallTitle {display: block;width: 98%; padding-left: 2%;    font-size: .8rem;    padding-top: 0.5rem;    padding-bottom: .5rem;    color: #666;}
		   .mui-content p.selectBox select {   display: block;    outline: none;    background-color: #f9f9f9;    -webkit-appearance: none;    height: 2.2rem;width: 100%;}
		    .mui-content p.selectBox {    display: block;    width: 97%;    height: auto;    background: #f9f9f9;    padding: 1.5%;}
		    .mui-input-group label.inputcontent{ padding-right: 15px;padding-left: 38px !important;line-height: 40px;padding:0}
		    .mui-input-group .inputcontent .img{float: left;height: 35px; width: 35px;top: 2px;position: relative;}
		    .mui-input-group .inputcontent .intro{float: right;color: #666; font-size: 12px;line-height: 40px;width: calc(100% - 50px);overflow: hidden;padding-right: 5px;}
		    .mui-input-group .inputcontent .img img{height: 35px; width: 35px;border-radius: 50%;content:'';font-size: 0;position: relative;top: -5px;}
			#popover{font-size: 12px;}
			#popover input{width: auto;height: 1em;margin-bottom: 1px;}
			#serachpsyer{box-sizing: border-box;margin: 0;}
			.showletter{height: 200px;margin-top: 20px;overflow-y: scroll;font-size: 12px;}
			.saveletter{display: block;width: 100%;line-height: 2em;text-align: center;font-size: 20px;color: #fff;background: #007aff;margin-bottom: 0;}
            .ztree * {font-size: 10pt;font-family:"Microsoft Yahei",Verdana,Simsun,"Segoe UI Web Light","Segoe UI Light","Segoe UI Web Regular","Segoe UI","Segoe UI Symbol","Helvetica Neue",Arial}
            .ztree li ul{ margin:0; padding:0}
            .ztree li {line-height:30px;}
            .ztree li a {width:200px;height:30px;padding-top: 0px;}
            .ztree li a:hover {text-decoration:none; background-color: #E7E7E7;}
            .ztree li a span.button.switch {visibility:hidden}
            .ztree.showIcon li a span.button.switch {visibility:visible}
            .ztree li a.curSelectedNode {background-color:#D4D4D4;border:0;height:30px;}
            .ztree li span {line-height:30px;}
            .ztree li span.button {margin-top: -7px;}
            .ztree li span.button.switch {width: 16px;height: 16px;}
            .zTreeDemoBackground{background: #f9f9f9;}
            .ztree li a.level0 span {font-size: 150%;font-weight: bold;}
            .ztree li span.button {background-image:url("./left_menuForOutLook.png"); *background-image:url("./left_menuForOutLook.gif")}
            .ztree li span.button.switch.level0 {width: 20px; height:20px}
            .ztree li span.button.switch.level1 {width: 20px; height:20px}
            .ztree li span.button.noline_open {background-position: 0 0;}
            .ztree li span.button.noline_close {background-position: -18px 0;}
            .ztree li span.button.noline_open.level0 {background-position: 0 -18px;}
            .ztree li span.button.noline_close.level0 {background-position: -18px -18px;}
		</style>
		
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">咨询师申请</h1>
			<a class="mui-pull-right" style=" color: #fff; padding-top: .7rem;" id="sureproer">提交</a>
		</header>
		<div class="mui-content">
			<span class="smallTitle">观护类型</span>
            <p class="selectBox ">
                <select class="jbType" id="protype" disabled>
                     <option>请选择观护类型</option>
                     <option value="record">观护记录</option>
                     <option value="thought">思想汇报</option>
                     <option value="evaluate">综合考评</option>
                     <option value="labour">劳动改造</option>
                </select>
            </p>
		</div>
		<span class="smallTitle">下属部门</span>
		<div class="zTreeDemoBackground left" style="height: 20vh;overflow-y: scroll;">
            <ul id="treeDemo" class="ztree"></ul>
        </div>
		<ul class="mui-table-view ul-ohter"> 
           <li class="mui-table-view-cell mui-collapse">
                    <a class="mui-navigate-right" href="#">选择观护人员</a>
                    <div class="mui-collapse-content">
                        <form class="mui-input-group">
                        </form>
                </div>
            </li>
        </ul>
		<script src="js/mui.js"></script>
		<script src="js/mui.picker.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.dtpicker.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.ztree.all.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/page/caseChangePro.js" type="text/javascript" charset="utf-8"></script>
	</body>
</html>